{# 继承 layout 模板 #}
{% extends '../layout.njk' %}

{# 标题 #}
{% block title %}
熊猫列表
{% endblock%}

{# CSS #}
{% block cssLinks %}
{{ super() }}
<link rel="stylesheet" href="/css/panda.css">
{% endblock %}

{# 页面内容 #}
{% block content %}
<h3 class="title">熊猫列表</h3>
<div class="tip-message">{{ message }}</div>
<div class="wrapper panda-list">
    {% for p in pandas%}
    <div class="panda-item">
        <span class="ordinal">{{ loop.index }}</span>
        <span class="name">{{ p.name }}</span>
        <span class="gender">{{ p.gender }}</span>
        <span class="birthdate">{{ p.birthdate }}</span>
        <span class="operation">
            <a href="/panda/edit/{{p.id}}">编辑</a>
            <a href="/panda/remove/{{p.id}}">删除</a>
        </span>
    </div>
    {% else %}
    <div class="empty">
        暂无数据
    </div>
    {% endfor%}
    <div class="links">
        <a href="/panda/add">添加熊猫</a>
    </div>
</div>
{% endblock %}